<?php
$css_files = $style->css_file;
$js_files = $style->js_files;
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <STYLE type="text/css">
            BODY { background: url('<?php echo base_url(); ?>library/blueloginbox/images/bg.jpg'); }

            table.GridTable {
                background: #D9EDF7;
                margin-top: 1px;
                margin-bottom:1px;
                border-collapse:collapse;
                border:0px;
                border-color: #000;
                /*clear:both;*/ 
                width:100%;
                box-shadow: 0px 0px 10px #ccc;
            }
            table.GridTable td {
                border:2px solid #000;
                line-height:2.5em;
                font-size:12px;
                padding:0px 6px;
            }
            table.GridTable a{

            }
            table.GridTable a:hover{
                color: #bbb;
                text-decoration: none;
            }

        </STYLE>
        <link href="<?php echo base_url(); ?>library/dropdownmenu/new.css" media="screen" rel="stylesheet" type="text/css" />
        <meta charset="utf-8" />

        <?php foreach ($css_files as $file): ?>
            <link type="text/css" rel="stylesheet" href="<?php echo $file; ?>" />        

        <?php endforeach; ?>

        <script src="<?php echo base_url(); ?>assets/grocery_crud/js/jquery-1.11.1.min.js"></script>
    </head>
    <body>
        <?php
        require_once('header_admin.php');
        ?>
        <div style='height:20px;'></div>
        <div style="font-family: 'Oxygen Mono', Tahoma, Arial, sans-serif; font-size: 12px;">
            <div id="dash_right">
                <?php
                $i = 0;
                foreach ($list_data_service as $data_service) {
                    $i++;
                    ?>
                    <div style="vertical-align: middle;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;
                         background-color:#808080;border:2px solid #FFFFFF; cursor: pointer;" class="head_x_<?php echo $i; ?>"><div class="icondiv"></div><br/>
                        <h1 style="text-align: left; color: #fff" id="ids_<?php echo $i; ?>">&nbsp;<?php echo $data_service["status_name"] . " (" . $data_service["jumlah"] . ")"; ?></h1>
                        <input type='hidden' id='num_x_<?php echo $i; ?>' value='1'/>
                        <br/>
                        <div style="margin-left: 20px; margin-right: 20px;" class="slide_x_<?php echo $i; ?>">
                            <?php
                            if ($data_service["jumlah"] > 0) {
                                ?>
                                <table class="GridTable">
                                    <tr class="GridHeader">
                                        <td width="20">No.</td>
                                        <td width="150">Member</td>
                                        <td width="100" >Kota Tujuan</td>
                                        <td width="150" >Tanggal Checkin</td>
                                        <td width="150" >Tanggal Checkout</td>
                                        <td width="150" >Jumlah Pemesan</td>
                                        <td>Catatan</td>
                                        <td width="100">Waktu Request</td>
                                        <td width="100">Action</td>
                                    </tr>
                                    <?php
                                    $no_item_service = 1;
                                    foreach ($data_service["data"]->result() as $row) {
                                        ?>
                                        <tr class="GridItem1" >
                                            <td ><?php echo $no_item_service; ?></td>
                                            <td ><?php echo $row->id_member . " (" . $row->nickname . ")"; ?></td>
                                            <td ><?php echo strtoupper($row->kota_tujuan); ?></td>
                                            <td ><?php echo strtoupper($row->tanggal_checkin); ?></td>
                                            <td ><?php echo strtoupper($row->tanggal_checkout); ?></td>
                                            <td ><?php echo strtoupper($row->jumlah_pemesan); ?></td>
                                            <td ><?php echo $row->catatan; ?></td>
                                            <td ><?php echo $row->date_created; ?></td>
                                            <td><a href="#" onclick="javascript:edit_service('<?php echo $row->id_request; ?>')">Set Status</a></td>
                                        </tr>
                                        <?php
                                        $no_item_service++;
                                    }
                                    ?>
                                </table>
                                <?php
                            }
                            ?>
                            <br/>
                        </div>
                    </div>
                <?php } ?>
            </div>
        </div>
        <!-- Beginning footer -->
        <div></div>
        <!-- End of Footer -->

        <script language="javascript">

            jQuery(document).ready(function() {

                var obj = {
                    "1": "x_1", "2": "x_2", "3": "x_3", "4": "x_4"
                };

                $.each(obj, function(key, value) {
                    //if(jQuery("#num_"+value).length !== 0)
                    //if(document.getElementById("num_"+value).value == 0)
                    jQuery(".slide_" + value).hide();

                    if (jQuery("#num_" + value).length !== 0) {
                        if (document.getElementById("num_" + value).value == 0) {
                            var temp_style = $(".head_" + value).attr('style');
                            $(".head_" + value).attr('style', temp_style + 'display:none;');
                            var temp_style = $(".ids_" + value).attr('style');
                            $(".ids_" + value).attr('style', temp_style + 'display:none;');
                            var temp_style = $(".num_" + value).attr('style');
                            $(".num_" + value).attr('style', temp_style + 'display:none;');
                            var temp_style = $(".slide_" + value).attr('style');
                            $(".slide_" + value).attr('style', temp_style + 'display:none;');
                        }
                    }

                    jQuery(".head_" + value).click(
                            function() {
                                jQuery(".slide_" + value).slideToggle();
                            }
                    );
                    jQuery(".head_" + value).mouseover(function() {
                        jQuery(".head_" + value).css("background-color", "#A4A4A4");
                    });
                    jQuery(".head_" + value).mouseout(function() {
                        jQuery(".head_" + value).css("background-color", "#808080");
                    });
                });

            });

            function edit_service(kode) {
                var url = '<?php echo base_url() . "index.php/transaksi/request_hotel_edit/edit/"; ?>' + kode;
                var win = window.open(url, '_blank');
                win.focus();                
            }
        </script>
    </body>
</html>